<template>
    <div id="trunk">
        <template>
		    <vHead appPath="/test" appTitle="组卷"></vHead>
            <main class="main maxW">
                <div class="test-nav">
                    <div class="test-location">
                        <span>当前定位：</span>
                        <el-select v-model="subjectID" placeholder="请选择" @change="getSubject">
                            <el-option v-for="item of subjectlist" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="test-link">
                        <router-link to="/test" :class="isActive('test') ? 'showActive' : ''">首页</router-link>
                        <router-link to="/test/manual" :class="isActive('manual') ? 'showActive' : ''">手动组卷</router-link>
                        <router-link to="/test/intelligent" :class="isActive('intelligent') ? 'showActive' : ''">智能组卷</router-link>
                        <router-link to="/test/item-bank" :class="isActive('item-bank') ? 'showActive' : ''">题库</router-link>
                        <router-link to="/test/common-library" class="library" :class="isActive('common-library') ? 'showActive' : ''">卷库</router-link>
                    </div>
                </div>
                <div class="test-template">
                    <router-view></router-view>
                </div>
            </main>
            <vFoot></vFoot>
        </template>
        <div id="backtop" @click='returnTop'>
            <i class="el-icon-caret-top"></i>
        </div>
    </div>
</template>
<script>
import vHead from "@/components/common/header";
import vFoot from '@/components/common/footer';
export default {
    components: { vHead, vFoot },
    data() {
        return {
            disabled: true,
            subjectID: '',
            /* 科目id */
            subjectlist: [],
            subjectArr: [],
            /* 科目数据 */
            timer: null,
            bSys: true,
        };
    },
    created() {
        this.getUserLabel()
    },
    mounted() {
        // 当网页向下滑动 20px 出现"返回顶部" 按钮
        document.addEventListener('scroll',  ()=>{
            this.scrollFunction()
        },false)
    },
    beforeDestroy () {
        sessionStorage.removeItem('subjectID')
    },
    computed: {
        /*路由导航高亮*/
        isActive (){
            return (name)=> {

                let route = this.$route;
                if (name == route.name){  
                    return true;
                }

                if (name == 'item-bank' && route.name == 'private-bank'){
                    return true;
                }

                if (name == 'common-library' && route.name == 'private-library'){
                    return true;
                }

                return false;
            }

        },
        children(){
            return (name)=>{
                let route = this.$route;
               switch(name){
                    case route === 'item-bank':
                    console.log(route);
                    break;
                    case route === 'private-bank':
                    console.log(route);
                    break;
                    case route === 'common-library':
                    console.log(route);
                    break;
                    case route === 'private-library':
                    console.log(route);
                    break;

               }
            }
        }
    },
    methods: {
        scrollFunction() {
            if (document.body.scrollTop > 200 || document.documentElement.scrollTop > 200) {
                document.getElementById("backtop").style.visibility = "visible";
            } else {
                document.getElementById("backtop").style.visibility = "hidden";
            }
        },

        // 点击按钮，返回顶部
        returnTop() {
            this.timer = setInterval(() => {
                var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; //获取滚动条距离顶部高度
                var iSpeed = Math.floor((0 - scrollTop) / 9); //Math.floor()向下取整   (0-scrollTop)表示：获取滚动条距离顶部高度的负值

                this.bSys = true; //意味着是系统在滚动，而不是用户


                document.documentElement.scrollTop = scrollTop + iSpeed; //设置滚动条距离顶部位置

                //当滚动条到达顶部，关闭定时器
                if (scrollTop == 0) {
                    clearInterval(this.timer);
                }
            }, 30);
        },
        getUserLabel() {
            let success = (data => {
                if(data.data.length>0){
                    let id = data.data[0].sub_id;
                    this.subjectID = id ? id : '';
                    this.disabled = id ? true : false;
                    this.getSubject()
                }
            })
            let params = {
                id: this.$store.getters.userInfo.id,
                userid: this.$g.user_id
            }
            //执行请求，并将回调方法变成config成员以便鉴权过期可以执行
            this.$ajax.get('api/user/user', { params: params, func: { success: success } })
        },
        /**
         * 请求科目的数据
         * @author lucky
         * @DateTime 2019-07-22T11:12:14+0800
         * @return   {[type]}                 [description]
         */
        getSubject() {
            this.subjectlist = [];
            let success = (res => {
              this.subjectlist = deep_clone(res.data);
                this.subjectArr =  res.data;
                if (this.subjectlist.length === 0) {
                     this.subjectID = ''
                };

                this.subjectlist.unshift({ name: '全部', id: 0 })
                let obj = null
               obj= this.subjectlist.find(item=>item.id == this.subjectID) == undefined ? '' : this.subjectlist.find(item=>item.id == this.subjectID)
            //    this.subjectID = obj.id ? obj.id : 0
               this.subjectID = 0
                sessionStorage.setItem('subjectID', this.subjectID)
                this.$store.commit('SET_QUESTIONCHANGE', new Date())                    
                // this.subjectlist = deep_clone(res.data);
                // this.subjectlist.unshift({ name: '全部', id: 0 })
                // this.subjectArr =  res.data;
                // let currentSubject = this.subjectlist.find(item => item.id == this.subjectID);
                // if(currentSubject){
                //     this.subjectID = currentSubject.id;
                // }
                // sessionStorage.setItem('subjectID', this.subjectID)
                // this.$store.commit('SET_QUESTIONCHANGE', new Date())
            });            
            if(this.$store.getters.isMulti){//多级级版 - 获取科目
                this.$ajax({
                    url: 'api/newlevel/platform_subject',
                    method: 'get',
                    params: {
                        app_code: sessionStorage.getItem('CheckSchoolAppCode'),
                    },
                    func: { success: success }
                })
            }else{//单级版 - 获取科目
                this.$ajax({
                    url: 'api/cate/subject',
                    method: 'get',
                    params: {
                        type: 2,
                        // org_id: 0,
                        status: 1,
                    },
                    func: { success: success }
                })
            }
        },
    },

};
</script>
<style lang="scss">
.main {
    box-sizing: border-box;
    min-height: calc(100vh - 124px);
    padding: 25px 0 40px;
}
.question-area{
    display: flex;
    justify-items: center;
    align-items: center;
    .el-form-item {
        margin-bottom: 0;
    }
}
@import "./../../../assets/css/test.scss";
</style>